<template>
	<view class="page">
		<view class="top">
			<uni-nav-bar
				left-icon="back"
			
	
				@click-left="back"
				:background-color="bgcolor"
				color="#fff"
				title="我的推广"
			></uni-nav-bar>
			<view class="main">
				<view class="tit">邀请您的小伙伴来赚钱啦</view>
				<view class="code">
					<qrcode  :val="sharelink" :size="qrsize" ref="qrcode"></qrcode>
				</view>
				<!-- <view><image src="../../static/img/erweima.png"></image></view> -->
				<view class="lianjie">
					<text>邀请链接</text>
					<input type="text" :disabled="true" v-model="sharelink" />
				</view>
				<view class="copy" @tap="copy">点击复制</view>
			</view>
		</view>
		<view class="main1">
			<view class="tit1">
				<text>推广列表</text>
				<text class="people">已推广999人</text>
			</view>
				<view class="content">
				<view class="item">
					<text>昨日提成</text>
					<text>888元</text>
				</view>
				<view class="item">
					<text>昨日交易</text>
					<text>99手</text>
				</view>
				<view class="item">
					<text>本月提成</text>
					<text>88元</text>
				</view>
				<view class="item">
					<text>本月交易</text>
					<text>66手</text>
				</view>
			</view>
		<!-- 	<view class="content">
				<view class="item">
					<text>昨日提成</text>
					<text>{{dataformat(tuiguang.zuo_ticheng)}}元</text>
				</view>
				<view class="item">
					<text>昨日交易</text>
					<text>{{dataformat(tuiguang.zuo_shoushu)}}手</text>
				</view>
				<view class="item">
					<text>本月提成</text>
					<text>{{dataformat(tuiguang.benyue_shoushu)}}元</text>
				</view>
				<view class="item">
					<text>本月交易</text>
					<text>{{dataformat(tuiguang.benyue_shoushu)}}手</text>
				</view>
			</view> -->
		</view>
		<view class="list">
			<view class="listitem th">
				<view class="w1">用户名</view>
				<view class="w2">交易笔数</view>
				<view class="w3">交易最后发布时间</view>
			</view>
			<view class="listitem td" >
				<view class="w1">99</view>
				<view class="w2">88</view>
				<view class="w3">99</view>
			</view>
			<!-- <view class="listitem td" v-for="(item,index) in tuiguang.huizong " :key="index">
				<view class="w1">{{item['bh']}}</view>
				<view class="w2">{{item['shoushu']}}</view>
				<view class="w3">{{item['zui_cj_shijian']}}</view>
			</view> -->
		</view>
		<view class="sharebox">
			<uni-popup :show="type === 'bottom-share'" position="bottom" @hidePopup="togglePopup('')">
				<view class="bottom-title">分享到</view>
				<view class="bottom-content">
					<view class="bottom-content-box" @tap="share">
						<view class="bottom-content-image"><image src="../../static/img/weixin.png"></image></view>
						<view class="bottom-content-text">微信</view>
					</view>
					<view class="bottom-content-box">
						<view class="bottom-content-image"><image src="../../static/img/pngyouquan.png"></image></view>
						<view class="bottom-content-text">微信</view>
					</view>
				</view>
				<view class="bottom-btn" @click="togglePopup('')">取消分享</view>
			</uni-popup>
		</view>
	</view>
</template>

<script>
	var _this;
	
	import { mapState } from 'vuex';
import uniPopup from '@/components/uni-popup/uni-popup.vue';
import qrcode from '@/components/qrcode/qrcode.vue';
import uniNavBar from '@/components/uni-nav-bar/uni-nav-bar.vue';
import uniIcon from '@/components/uni-icon/uni-icon.vue';
export default {
	components: {
		uniNavBar,
		uniIcon,
		qrcode,
		uniPopup
	},
	data() {
		return {
			bgcolor: 'transparent',
			sharelink: '',
			type: '',
			qrval: '',
			qrsize: 150,
			bottomData: [
				{
					text: '微信',
					icon: '\ue6a4',
					name: 'wx'
				},
				{
					text: '朋友圈',
					icon: '\ue646',
					name: 'wx'
				},
				{
					text: 'QQ',
					icon: '\ue66b',
					name: 'qq'
				}
			]
		};
	},
			filters:{
		capitalize:function(value){
			if(value){
				
				return value;
			}
			else{
				return 0;
			}
			
		}
	},
	onLoad() {
		//  _this = this;
		//  this.sharelink = "http://khd.zxjgjy.com:801/register?code=" +this.userinfo.tuiguang;
		// var data = {
		// 	token: uni.getStorageSync('token')
		// };
		// this.$store.dispatch('tuiguang', data)
		// .then(res => {
		// 	
		// 	if (res.data.code == 1) {
		// 		 // _this.sharelink = res.data.data.tg_lianjie;
		// 		  if (!this.sharelink) {
		// 		 	
		// 		 	return;
		// 		 }
		// 		 console.log(_this.sharelink)
		// 		 
		// 		
		// 		 
		// 	}
		// });
		
	},
	onReady() {
		 // _this.$refs.qrcode.creatQrcode();
	},
	methods: {
		toback() {
			uni.navigateBack({
				delta: 1
			});
		},
		back() {
			uni.navigateBack({
				delta: 1
			});
		},
		copy() {
			uni.setClipboardData({
				data: this.sharelink,
				success: function() {
					console.log('success');
				}
			});
		},
		togglePopup(type) {
			this.type = type;
		},
		share() {
			uni.share({
				provider: 'weixin',
				scene: 'WXSceneSession',
				type: 0,
				href: 'http://uniapp.dcloud.io/',
				title: 'uni-app分享',
				summary: '我正在使用HBuilderX开发uni-app，赶紧跟我一起来体验！',
				imageUrl: 'https://img-cdn-qiniu.dcloud.net.cn/uniapp/images/uni@2x.png',
				success: function(res) {
					console.log('success:' + JSON.stringify(res));
				},
				fail: function(err) {
					console.log('fail:' + JSON.stringify(err));
				}
			});
		}
	},
	onPageScroll: function(e) {
		this.bgcolor = 'rgba(250,63,63,' + e.scrollTop / 100 + ')';
	},
		computed: mapState({
		// tuiguang: 'tuiguang',
		// userinfo: 'userinfo',
		dataformat() {
			return function(value) {
	
				let num;
				if(value >99999999){
					num = (Math.floor(value / 10000000) / 10) + '亿';
				}
				if(value > 9999 && value <99999999) { //大于9999显示x.xx万
					num = (Math.floor(value / 1000) / 10) + '万';
				} else if(value < 9999 && value > -9999) {
					num = value
				} else if(value < -9999) { //小于-9999显示-x.xx万
					num = -(Math.floor(Math.abs(value) / 1000) / 10) + 'W'
				}
				return num;
	
			}
		}
	}),
};
</script>
<style lang="scss" scoped src="./index.scss"></style>
